<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>配置管理面板</title>
    <meta name="description" content="这是一个 index 页面">
    <meta name="keywords" content="index">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="renderer" content="webkit">
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <link rel="icon" type="image/png" href="assets/i/favicon.png">
    <link rel="apple-touch-icon-precomposed" href="assets/i/app-icon72x72@2x.png">
    <meta name="apple-mobile-web-app-title" content="Amaze UI" />
    <script src="assets/js/echarts.min.js"></script>
    <link rel="stylesheet" href="assets/css/amazeui.min.css" />
    <link rel="stylesheet" href="assets/css/amazeui.datatables.min.css" />
    <link rel="stylesheet" href="assets/css/app.css">
    <script src="assets/js/jquery.min.js"></script>
    <script src="assets/js/util.js"></script>
    <style>
        .teamName,
        .propertyName {
            border-radius: 4px;
            margin-left: 30px;
        }

        .btncommon {
            font-size: 1rem;
            padding: 0.2em 0.3em;
        }

        .am-btn-success {
            margin-left: 15px;
        }

        .subitemName {
            margin-right: 15px;
        }

        .displayNone {
            display: none;
        }

        .itemWrap {
            border-left: none!important;
        }

        .liStyle {
            display: block;
            color: #868E8E;
            padding: 10px 0px;
            border-left: #282d2f 3px solid;
            font-size: 14px;
            cursor: pointer;
        }

        .liStyle:hover {
            background-color: #232829;
            color: #fff;
        }

        .liStyle:active {
            cursor: pointer;
            color: #fff;
            background: #232829;
        }

        .addTeamName {
            visibility: hidden;
            margin-left: 72px;
        }

        .addSubItem {
            visibility: hidden;
            float: right;
            margin-right: 48px;
            margin-top: 6px;
        }

        .removeItem {
            visibility: hidden;
            float: right;
            margin-right: -30px;
            margin-top: 6px;
        }

        .removeSubItem {
            visibility: hidden;
            float: right;
            margin-right: 27px;
            margin-top: 6px;
        }
    </style>
</head>

<body data-type="index">
    <script src="assets/js/theme.js"></script>
    <div class="am-g tpl-g">
        <!-- 头部 -->
        <header>
            <!-- logo -->
            <div class="am-fl tpl-header-logo">
                <a href="javascript:;"><img src="assets/img/logo2.png" alt=""></a>
            </div>
            <!-- 右侧内容 -->
            <div class="tpl-header-fluid">
                <!-- 侧边切换 -->
                <div class="am-fl tpl-header-switch-button am-icon-list">
                    <span>

                </span>
                </div>
                <!-- 其它功能-->
                <div class="am-fr tpl-header-navbar">
                    <ul>
                        <!-- 欢迎语 -->
                        <li class="am-text-sm tpl-header-navbar-welcome">
                            <a href="javascript:;">欢迎你, <span>Amaze UI</span> </a>
                        </li>
                        <!-- 退出 -->
                        <li class="user-out  am-text-sm">
                            <a href="javascript:;">
                                <span class="am-icon-sign-out"></span> 退出
                            </a>
                        </li>
                    </ul>
                </div>
            </div>

        </header>

        <!-- 侧边导航栏 -->
        <div class="left-sidebar">
            <!-- 菜单 -->
            <ul class="sidebar-nav" id="nav">
                <li class="sidebar-nav-link">
                    <a href="index.html" class="active">
                    <i class="am-icon-home sidebar-nav-link-logo"></i> 首页
                </a>
                </li>
                <li class="li-hide sidebar-nav-link">
                    <a href="javascript:;" class="sidebar-nav-sub-title pageLink" pageUrl="user-info.html" id="gain">
                    <i class="am-icon-table sidebar-nav-link-logo"></i>
                            用户列表
                </a>
                </li>
                <li class="sidebar-nav-link">
                    <a href="javascript:;" pageUrl="keymanage.html" class="pageLink sidebar-nav-sub-title">
                    <i class="am-icon-table sidebar-nav-link-logo"></i> 加密key管理
                </a>
                </li>
                <li class="sidebar-nav-link">
                    <a href="javascript:;" class="sidebar-nav-sub-title itemGroup">
                        <i class="am-icon-table sidebar-nav-link-logo"></i> 项目组<span class="addTeamName"><span class="am-icon-plus"></span></span>
                        <span class="am-icon-chevron-down am-fr am-margin-right-sm sidebar-nav-sub-ico"></span>
                    </a>
                    <ul class="sidebar-nav sidebar-nav-sub addConfig" id="addConfig">
                    </ul>
                </li>
            </ul>
        </div>

        <!-- 内容区域 -->
        <div class="tpl-content-wrapper">
            <iframe src="./table-list.html" frameborder="0" scrolling="no" width="100%" id="framePage"></iframe>
        </div>


        <!--新建项目组-->
        <div class="am-modal am-modal-confirm" tabindex="-1" id="newItem">
            <div class="am-modal-dialog">
                <div class="am-modal-hd">新建项目组</div>
                <div class="am-modal-bd">
                    <span>teamName:</span><input class="teamName" />
                </div>
                <div class="am-modal-footer">
                    <span class="am-modal-btn" data-am-modal-cancel>取消</span>
                    <span class="am-modal-btn" data-am-modal-confirm>确定</span>
                </div>
            </div>
        </div>
        <!--新建配置文件-->
        <div class="am-modal am-modal-confirm" tabindex="-1" id="newSubItem">
            <div class="am-modal-dialog">
                <div class="am-modal-hd">新建配置文件</div>
                <div class="am-modal-bd">
                    <span>propertyName:</span><input class="propertyName" />
                </div>
                <div class="am-modal-footer">
                    <span class="am-modal-btn" data-am-modal-cancel>取消</span>
                    <span class="am-modal-btn" data-am-modal-confirm>确定</span>
                </div>
            </div>
        </div>
        <!--删除项目组-->
        <div class="am-modal am-modal-confirm" tabindex="-1" id="removeItem">
            <div class="am-modal-dialog">
                <div class="am-modal-bd">
                    您确定要删除此项目组吗？
                </div>
                <div class="am-modal-footer">
                    <span class="am-modal-btn" data-am-modal-cancel>取消</span>
                    <span class="am-modal-btn" data-am-modal-confirm>确定</span>
                </div>
            </div>
        </div>
        <!--删除配置文件-->
        <div class="am-modal am-modal-confirm" tabindex="-1" id="removeSubItem">
            <div class="am-modal-dialog">
                <div class="am-modal-bd">
                    您确定要删除此配置文件吗？
                </div>
                <div class="am-modal-footer">
                    <span class="am-modal-btn" data-am-modal-cancel>取消</span>
                    <span class="am-modal-btn" data-am-modal-confirm>确定</span>
                </div>
            </div>
        </div>
    </div>
    </div>
    <script src="assets/js/amazeui.min.js"></script>
    <script src="assets/js/amazeui.datatables.min.js"></script>
    <!--<script src="assets/js/dataTables.responsive.min.js"></script>-->
    <script src="assets/js/app.js"></script>
    <script src="assets/js/index.js"></script>
</body>

</html>